<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>WebSocket客户端</title>
</head>

<body>

<form onsubmit="return false">

    <h4>用户登录：</h4>
    <input type="text" name="username" placeholder="请输入用户名" style="width: 200px">
    <input type="password" name="password" placeholder="请输入密码" style="width: 200px">
    <input type="button" value="登录" onclick="login(this.form.username.value, this.form.password.value)">

    <h4>退出登录：</h4>
    <input type="button" value="退出登录" onclick="logout()">

    <hr>
    <h4>发送一对一消息:</h4>
    <input type="text" name="toUserId" placeholder="请输入接收用户的userId" style="width: 200px"><br>
    <textarea name="message" style="width: 300px;height: 50px"></textarea>
    <input type="button" value="发送一对一消息" onclick="sendToUser(this.form.toUserId.value, this.form.message.value)">

    <hr>
    <h4>创建群组:</h4>
    <input type="text" name="userIdList" placeholder="请输入要邀请用户的userId，多个以英文,分割" style="width: 300px">
    <input type="button" value="创建群组" onclick="createGroup(this.form.userIdList.value)">

    <hr>
    <h4>加入群组:</h4>
    <input type="text" name="joinGroupId" placeholder="请输入要加入的群组的groupId" style="width: 300px">
    <input type="button" value="加入群组" onclick="joinGroup(this.form.joinGroupId.value)">

    <hr>
    <h4>退出群组:</h4>
    <input type="text" name="quitGroupId" placeholder="请输入要退出的群组的groupId" style="width: 300px">
    <input type="button" value="退出群组" onclick="quitGroup(this.form.quitGroupId.value)">

    <hr>
    <h4>群成员列表:</h4>
    <input type="text" name="membersGroupId" placeholder="请输入要获取群成员列表的群组的groupId" style="width: 300px">
    <input type="button" value="群成员列表" onclick="getGroupMembers(this.form.membersGroupId.value)">

    <hr>
    <h4>发送群消息:</h4>
    <input type="text" name="toGroupId" placeholder="请输入接收群组的groupId" style="width: 200px"><br>
    <textarea name="groupMessage" style="width: 300px;height: 50px"></textarea>
    <input type="button" value="发送群消息" onclick="sendToGroup(this.form.toGroupId.value, this.form.groupMessage.value)">

    <hr>
    <h4>服务器输出:</h4>
    <textarea id="responseText" style="width: 300px;height: 250px;"></textarea>
    <input type="button" onclick="document.getElementById('responseText').value=''" value="清空日志">

</form>

<script type="text/javascript" src="js/codec.js"></script>
<script type="text/javascript" src="js/dispatch.event.js"></script>
<script type="text/javascript" src="js/socket.js"></script>
</body>

</html>